<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
.layer1{height:100px;}
   .layer1-1{width:30%;height:100px;background:pink;float:left;}
   .layer1-2{width:40%;height:100px;background:blue;float:left;}
   .layer1-3{width:30%;height:100px;background:yellow;float:left;}
   .layer1-4{clear:both;}
.layer2{height:100px;width:100%;background:brown;}
.layer3{height:100px;width:100%;background:#F90;}
</style>
</head>
<body>
<div class=layer1>
    <div class=layer1-1></div>
    <div class=layer1-2></div>
    <div class=layer1-3></div>
    <div class=layer1-4></div>
</div>
<div class=layer2></div>
<div class=layer3></div>
</body>
</html>